import { memo, useEffect, useState } from 'react';
import { isArray, isEmpty } from 'esy-ui';
// import { postRegistryTips } from '@/services';
import { type TTS } from '.';

interface KindTipsProps {
  type: TTS;
}

const kindTexts = [
  { text: '1. 标记有*为必填项目', id: 1, specialIndex: 6, specialLen: 1 },
  { text: '2. 手机与取款密码为取款金额时的凭证，请会员务必填写详细资料。', id: 2 },
  { text: '3. 若公司有其他活动会邮箱通知，请客户填写清楚', id: 3 },
];

function KindTips(props: KindTipsProps) {
  const { type } = props;
  const [tips, setTips] = useState(null);

  useEffect(() => {
    if (Number(type) === 1) {
      setTips(kindTexts);
      // postRegistryTips({})
      //   .then((res) => {
      //     console.warn(res);
      //   })
      //   .catch(() => {});
    }
  }, [type]);

  if (!isArray(tips) || isEmpty(tips)) return null;

  return (
    <ul className='text-split px-3 py-2 bg-black rounded'>
      {tips.map((it) => {
        if (it.specialLen && it.specialLen > 0) {
          return (
            <li key={it.id} className=''>
              {it.text.slice(0, it.specialIndex)}
              <span className='text-primary mx-0.5'>{it.text.slice(it.specialIndex, it.specialIndex + it.specialLen)}</span>
              {it.text.slice(it.specialIndex + it.specialLen)}
            </li>
          );
        }
        return <li key={it.id}>{it.text}</li>;
      })}
    </ul>
  );
}

export default memo(KindTips);

